import React, { Component } from 'react'
import './manufacturerItem.less'
import ManufacturerInfo from "../../../types/ManufacturerInfo";
import { withRouter, RouteComponentProps, Link } from 'react-router-dom';
import { getRes } from '../../../configFile';
import { getAreaName } from '../../../requests/Manufacturer';
import { message } from 'antd';

interface IProps extends RouteComponentProps {
    manufacturer: ManufacturerInfo
}

interface IState {
    manuAddr: string
}
class ManufactureItem extends Component<IProps, IState> {
    constructor(props: IProps) {
        super(props);
        this.state = {
            manuAddr: this.props.manufacturer.manufacturerAddress
        }
    }
    async componentDidMount() {
        try {
            const areaCode = this.props.manufacturer.manufacturerAddress.split(',')[0]
            const areaRes = getRes(await getAreaName(areaCode));
            if (areaRes.isSuccessful) {
                this.setState({
                    manuAddr: areaRes.data + ' ' + this.props.manufacturer.manufacturerAddress.split(',').filter(
                        (item, index) => index !== 0
                    ).join('')
                })
            }
        } catch (err) {
            message.error(err.toString());
        }
    }
    render() {
        const { manufacturer } = this.props;
        return (
            <div key={manufacturer.manufacturerName} className="ManufacturerListItem">
                <div className='titleLine'>
                    <h1><Link to={`/manufacturer/${this.props.manufacturer.manufacturerID}`}>{manufacturer.manufacturerName}</Link></h1>
                </div>
                <div className="ManufacturerListItemTextBox">
                    <div className="manufacturerInformation">
                        <div className="name"><b>联系电话：</b>{manufacturer.manufacturerTelephone}</div>
                        <div className="address"><b>厂商地址：</b>{this.state.manuAddr}</div>
                        <div className="intro"><b>厂商简介：</b>{manufacturer.manufacturerIntroduction.slice(0.150)}</div>
                    </div>
                </div>
            </div>
        )
    }
}
export default withRouter(ManufactureItem);